<!DOCTYPE html>
<html>
<head>
<title>stuManager.html</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript" src="js/loader.js"></script>
<script type="text/javascript">
	$(function(){
		//初始化table
		var tbObj = new TableInit();
		tbObj.Init();
		
		//初始化按钮
		var btnObj = new ButtonInit();
		btnObj.Init();
		
		//初始化模态窗口
		$("#myModal").modal({
			keyboard: true,
			show: false,
			backdrop: "static"
		});
		//初始化提示框
		toastr.options.positionClass = "toast-center";
	});
	//传统方法定义js类
	var TableInit = function() {
		//初始化Table(用this定义的是公有方法或属性)
		this.Init = function() {
			$("#tb_stu").bootstrapTable({
				url : "restCommentJson.htm", //请求后台的URL（*）
				method : "get", //请求方式（*）
				//如果使用post，contentType默认用json发送数据，java后台无法通过getParameter获取参数
				//contentType : "application/x-www-form-urlencoded",
				toolbar : "#toolbar", //工具按钮用哪个容器
				striped : false, //是否显示行间隔色
				cache : false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
				sortable : true, //是否启用排序
				sortName : "userid", //排序的字段
				sortOrder : "asc", //排序方式
				queryParamsType : "limit", //采用restful风格发送数据
				queryParams : queryParams,//传递参数（*）
				//设置为其他，可以获取pageNumber，pageSize，searchText，sortName，sortOrder  
				//设置为limit可以获取limit, offset, search, sort, order  
				pagination : true, //是否显示分页（*）
				sidePagination : "server", //分页方式：client客户端分页，server服务端分页（*）
				pageNumber : 1, //初始化加载第一页，默认第一页
				pageSize : 10, //每页的记录行数（*）
				pageList : [ 10, 25, 50, 100 ], //可供选择的每页的行数（*）
				silentSort : true, //分页时自动记住排序
				//search : true, //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
				//strictSearch : false,   //false是模糊搜索，true是精确搜索
				showColumns : true, //是否显示所有的列	
				minimumCountColumns : 2, //最少允许的列数
				clickToSelect : true, //是否启用点击选中行
				//height : 500, //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
				uniqueId : "userid", //每一行的唯一标识，一般为主键列
				
				
				//detailView : false, //是否显示父子表
				columns : [ { //配置列属性
					checkbox : true
				}, 
				{
					field : "videoname",
					title : "视频名",
					align : "center",
					valign : "middle",
					visible : true, //设置不显示字段
					
				// 开启排序功能
				}, {
					field : "content",
					title : "评论内容",
					align : "center",
					valign : "middle",
					
				// 开启排序功能
				}, {
					field : "commenttime",
					title : "评论时间",
					align : "center",
					valign : "middle",
					sortable : true
				// 开启排序功能
				} ],
				responseHandler : function(res) {
					//console.log(res);
					return {
						"total" : res.datas.total,//总记录数
						"rows" : res.datas.list
					//数据
					};
				}
			});
		};

		//得到查询的参数(用var定义的是私有方法或属性)
		var queryParams = function(params) {
			//console.log(params);
			var paramdata = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
				pageSize : params.limit, //页面大小
				pageNum : params.offset, //页码
				sort : params.sort, //排序字段
				order : params.order //排序方式
				//sname : $("#sname").val(),
			};
			console.log($("#userid").val());
			return paramdata;
		};

	};
	
	var ButtonInit = function() {
		
		this.Init = function(){
			
			$("#btn_delete").click(function(){
				var selection = $("#tb_stu").bootstrapTable("getSelections");
				if(selection.length>1){
					toastr.warning("只能选择一行数据进行删除");
					return;
				}
				if(selection.length<=0){
					toastr.warning("请选择有效数据");
					return;
				}
				Tip.confirm({
					title: "删除",
					message: "您确认删除选择的数据吗？",
					btnok: "残忍删除",
					btncl: "放过一马"
				}).on(function(res){
					if(!res)return;
					var commentid=selection[0].commentid;
					$.del("restCommentJson.htm",commentid,function(res){
						commonResult(res);
					});
				});
			});
			$("#btn_submit").click(function(){
				//核心：获取表单数据，并组装成json
				var param = $("#formChange").serializeJson();
				//console.log(param);
				if($("#commentid").val()!=""){   //commentid不为空则处理修改
					$.edit("restCommentJson.htm",param,function(res){
						commonResult(res);
					});
				}else{   //commentid为空则处理添加
					$.add("restCommentJson.htm",param,function(res){
						commonResult(res);
					});
				}
				$("#myModal").modal("hide");
			});
		}
		
		var commonResult = function(res){
			if(res.state==0){
				toastr.success(res.message);
			}else{
				toastr.error(res.message);
			}
			$("#tb_stu").bootstrapTable("refresh");
		}
	}
</script>
</head>
<body style="margin:20px 20px 0 20px;">							
		<!-- <input  id="sname"> -->
		<div id="toolbar" class="btn-group">
			<button id="btn_delete" type="button" class="btn btn-default">
				<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
				删除
			</button>
		</div>
		<table id="tb_stu"></table>
</body>
</html>
